﻿@using ThuySan.Areas.Backend.Models
@using ThuySan.Models
@model ThuySan.Models.ProductModel
@{
    Layout = "~/Areas/Backend/Views/Shared/_Layout.cshtml";

    Header header = new Header {
                                       Common = "ViewUserControl_Product_Add",
                                       CurentCommon = "Product",
                                       PageHeader = "Edit Product",
                                       Menulv1 = "01",
                                       Menulv2 = "0102"
                               };
    ViewData[Header.Key] = header;
    ViewBag.Title = "Edit Product - Admin Control Panel";
    Html.EnableClientValidation();
}
<div class="content-box">
    <div class="content-box-header">
        <h3>
            Add Product</h3>
    </div>
    <div class="content-box-content">
        @using (Html.BeginForm("Edit", "Product", FormMethod.Post, new {
                                                                               enctype = "multipart/form-data"
                                                                       }))
        {
            @Html.HiddenFor(c => c.ProductId)
            @Html.ValidationMessage("error")
            <div class="input-item">
                <label>
                    Category</label>
                @Html.DropDownListFor(c => c.CategoryId, (IEnumerable<SelectListItem>) ViewBag.Categories, new {
                                                                                                                       style = "width: 300px;"
                                                                                                               })
            </div>
            <div class="input-item">
                <label>
                    Name</label>
                @Html.TextBoxFor(c => c.Name, new {
                                                          @class = "text-input medium-input"
                                                  })
                @Html.ValidationMessageFor(c => c.Name)
            </div>
            <div class="input-item">
                <label>
                    Description</label>
                @Html.TextAreaFor(c => c.Description, new {
                                                          @class = "text-input large-input"
                                                  })
                @Html.ValidationMessageFor(c => c.Description)
            </div>
            <div class="input-item">
                <label>
                    Detail</label>
                @{
                    Html.Telerik().Editor().Name("Detail").Encode(false).HtmlAttributes(new {
                                                                                                    style = "height:400px"
                                                                                            }).FileBrowser(t => t.Browse("Browse", "ImageBrowser").Thumbnail("Thumbnail", "ImageBrowser").Upload("Upload", "ImageBrowser").DeleteFile("DeleteFile", "ImageBrowser").DeleteDirectory("DeleteDirectory", "ImageBrowser").CreateDirectory("CreateDirectory", "ImageBrowser")).Value(Model.Detail).Render();
                }
            </div>
            <div class="input-item">
                <label>
                    Priority</label>
                @Html.TextBoxFor(c => c.Priority, new {
                                                              @class = "text-input tiny-input"
                                                      })
                @Html.ValidationMessageFor(c => c.Priority)
            </div>
            <div class="input-item">
                <label>
                    Viewer</label>
                @Html.TextBoxFor(c => c.Viewer, new {
                                                            @class = "text-input tiny-input"
                                                    })
                @Html.ValidationMessageFor(c => c.Priority)
            </div>
            <div class="input-item">
                <label>
                    Image</label>
                @if (!string.IsNullOrEmpty(Model.AvatarImage))
                {
                    <img src="@Html.UploadPath("Products")@Model.AvatarImage" width="200" />
                    <br />
                }
                <input type="file" name="thumbnail" id="thumbnail" />
                @Html.ValidationMessageFor(c => c.AvatarImage)
            </div>
          @*  <div class="input-item">
                <label>
                    Price</label>
                @Html.TextBoxFor(c => c.Price, new {
                                                           @class = "text-input tiny-input"
                                                   })
                @Html.ValidationMessageFor(c => c.Price)
            </div>
            <div class="input-item">
                <label>
                    Promotional Price</label>
                @Html.TextBoxFor(c => c.PromotionalPrice, new {
                                                                      @class = "text-input tiny-input"
                                                              })
                @Html.ValidationMessageFor(c => c.PromotionalPrice)
            </div>*@
            <div class="input-item">
                <label>
                    Status</label>
                @Html.CheckBoxFor(c => c.Status)
                @Html.ValidationMessageFor(c => c.Status)
            </div>
            <div class="input-item">
                <label>
                    Reduced</label>
                @Html.CheckBoxFor(c => c.IsReduced)
                @Html.ValidationMessageFor(c => c.IsReduced)
            </div>
            <div class="input-item">
                <label>
                    Is Visibled</label>
                @Html.CheckBoxFor(c => c.IsVisibled)
                @Html.ValidationMessageFor(c => c.IsVisibled)
            </div>
            <div class="title-seperator">
                Page Information</div>
            <div class="seperator">
            </div>
            <div class="input-item">
                <label>
                    Url</label>
                @Html.TextBoxFor(c => c.PageUrl, new {
                                                             @class = "text-input medium-input"
                                                     })
                @Html.ValidationMessageFor(c => c.PageUrl)
            </div>
            <input type="submit" value="Update" class="button" />
            <input type="button" onclick="javascript:window.location.href='@Url.Action("Index")';" value="Reset" class="button" />
        }
    </div>
</div>
@Html.Partial("_ViewUserControlNotification")
@{
    Html.Telerik().TabStrip().Name("tabs").Items(c =>
                                                     {
                                                         c.Add().Text("Image").Content(Html.Action("ProductImages", new {
                                                                                                                                id = Model.ProductId
                                                                                                                        }).ToHtmlString());
                                                         c.Add().Text("Property").Content(Html.Action("ProductProperties", new {
                                                                                                                                       id = Model.ProductId
                                                                                                                               }).ToHtmlString());
                                                         c.Add().Text("Option").Content(Html.Action("ProductTags", new {
                                                                                                                               id = Model.ProductId
                                                                                                                       }).ToHtmlString());
                                                     }).SelectedIndex(0).Render();
}
@Html.Telerik().Window().Name("windowAddImage").Modal(true).Title("Add Image").Width(400).Height(380).Content("<iframe class=\"dialog\" src=\"\" style=\"width:100%;height:90%\"></iframe>").Draggable(true).Visible(false)
@Html.Telerik().Window().Name("windowEditImage").Modal(true).Title("Update Image").Width(400).Height(380).Content("<iframe class=\"dialog1\" src=\"\" style=\"width:100%;height:90%\"></iframe>").Draggable(true).Visible(false)
@Html.Telerik().Window().Name("windowAddProperty").Modal(true).Title("Add Property").Width(400).Height(380).Content("<iframe class=\"dialog2\" src=\"\"></iframe>").Draggable(true).Visible(false)
@Html.Telerik().Window().Name("windowEditProperty").Modal(true).Title("Edit Property").Width(400).Height(380).Content("<iframe class=\"dialog3\" src=\"\"></iframe>").Draggable(true).Visible(false)
@section css {
    <style type="text/css">
        .tag-option { padding: 5px 10px; }

        .dialog, .dialog1, .dialog2, .dialog3 {
            border: none;
            height: 95%;
            outline: none;
            width: 100%;
        }
    </style>
}
@section script
{
    <script type="text/javascript">

        $(document).ready(function() {
            var ids = $('#Ids').val().split(',');
            for (var i = 0; i < ids.length; i++) {
                $('#tag_' + ids[i]).attr('checked', 'checked');
            }
        });

        function updateTag() {
            var obj = $('.tag');
            var ids = [];
            for (var i = 0; i < obj.length; i++) {
                if (obj[i].checked) {
                    ids.push($(obj[i]).attr('value'));
                }
            }
            $.post('@Url.Action("AddTag")', { id: @Model.ProductId, ids: ids.toString() }, function(data) {
                ShowNotification(data);
            });
        }

        function addImage() {
            var window = $('#windowAddImage').data('tWindow');
            window.center();
            $('.dialog').attr('src', '@Url.Action("AddImage", new {
                                                                          id = Model.ProductId
                                                                  })');
            window.open();
        }

        function closePopup(obj) {
            var window = $('#windowAddImage').data('tWindow');
            window.close();
            if (obj) {
                $("#grid").data("tGrid").ajaxRequest();
            }
        }

        function editImage(id) {
            var window = $('#windowEditImage').data('tWindow');
            window.center();
            $('.dialog1').attr('src', '@Url.Action("EditImage", new {
                                                                            id = "ID"
                                                                    })'.replace('ID', id));
            window.open();
        }

        function closePopupEdit(obj) {
            var window = $('#windowEditImage').data('tWindow');
            window.close();
            if (obj) {
                $("#grid").data("tGrid").ajaxRequest();
            }
        }

        function deleteImage(id) {
            if (confirm("Do you want to delete?"))
                $.post('@Url.Action("DeleteImage", "Product")', { id: id }, function(data) {
                    ShowNotification(data);
                    $("#grid").data("tGrid").ajaxRequest();
                });
        }

        function addProperty() {
            var window = $('#windowAddProperty').data('tWindow');
            window.center();
            $('.dialog2').attr('src', '@Url.Action("AddProperty", new {
                                                                              id = Model.ProductId
                                                                      })');
            window.open();
        }

        function closePopupAddProperty(obj) {
            var window = $('#windowAddProperty').data('tWindow');
            window.close();
            if (obj) {
                $("#gridProperty").data("tGrid").ajaxRequest();
            }
        }

        function editProperty(id) {
            var window = $('#windowEditProperty').data('tWindow');
            window.center();
            $('.dialog3').attr('src', '@Url.Action("EditProperty", new {
                                                                               id = "ID"
                                                                       })'.replace('ID', id));
            window.open();
        }

        function closePopupEditProperty(obj) {
            var window = $('#windowEditProperty').data('tWindow');
            window.close();
            if (obj) {
                $("#gridProperty").data("tGrid").ajaxRequest();
            }
        }

        function deleteProperty(id) {
            if (confirm("Do you want to delete?"))
                $.post('@Url.Action("DeleteProperty", "Product")', { id: id }, function(data) {
                    $("#gridProperty").data("tGrid").ajaxRequest();
                    ShowNotification(data);
                });
        }

    </script>
}